<div fwa-layout-container data-main="true" class="full-height full-width">
	<div fwa-layout-box="north" class="background-white" style="height:80px;">
		<div class="full-width full-height" style="padding-top:4px;padding-bottom:4px;">
			<div style="line-height:64px;" class="col-xs-2 ">
				<input fwa-datetime class="form-control" data-type="year" data-format="yyyy-mm"  ng-model="date">
			</div>
			<div class=" col-xs-3" >
				<div class="callout callout-info "  ng-click="queryFeeView()">
					<h3><span ng-bind="feeInfo.feeTotal"></span><small class="text-muted">万元</small></h3>
					<p><label class="text-muted">当月费用总额</label></p>
				</div>
			</div>
			<div class="col-xs-3" >
				<div class="callout " ng-class="{'callout-danger':feeInfo.yoy > 0,'callout-success':feeInfo.yoy < 0,'callout-fair' : feeInfo.yoy == 0}">
					<h3><span ng-bind="feeInfo.yoy"></span><small>%</small>
						<span class="glyphicon" ng-class="{'glyphicon-arrow-up':feeInfo.yoy > 0, 'glyphicon-arrow-down':feeInfo.yoy < 0 ,'glyphicon-minus' : feeInfo.yoy == 0}"></span>
					</h3>
					<p><label class="text-muted">同比</label></p>
				</div>
			</div>
			<div class="col-xs-3" >
				<div class="callout " ng-class="{'callout-danger':feeInfo.mom > 0,'callout-success':feeInfo.mom < 0 ,'callout-fair' : feeInfo.mom == 0}">
					<h3><span ng-bind="feeInfo.mom"></span><small>%</small>
						<span class="glyphicon " ng-class="{'glyphicon-arrow-up': feeInfo.mom > 0, 'glyphicon-arrow-down': feeInfo.mom < 0,'glyphicon-minus' : feeInfo.mom == 0}"></span>
					</h3>
					<p><label class="text-muted">环比</label></p>
				</div>
			</div>
		</div>
	</div>
	
	<div fwa-layout-box="west" style="width:170px;" data-padding="true">
		<div class="panel panel-default full-height full-width">
			<div class="panel-body">
				<div class="row">
					<div class="col-xs-12">
						<ul id="idesk_data_nav">
							<li>
								<div class="img-circle text-center" ng-click="openKpiModal()">
									<div class="icon-block">
										<span class="glyphicon glyphicon-calendar"></span>
									</div>
									<span>指标查询</span>
								</div>
							</li>
							<li>
								<div class="img-circle text-center" ng-click="openhospitalModal()">
									<div class="icon-block">
										<span class="glyphicon glyphicon-list-alt"></span>
									</div>
									<span>医疗机构</span>
								</div>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
    </div>
    <div fwa-layout-box="center" data-padding="true">
	    <div  class="col-xs-12 full-height" ng-controller="FeeCtrl" >
	    	<div  class="row full-height " style="border: 1px solid transparent;" fwa-layout-container fwa-layout-fullsize="true">
			   	<div fwa-layout-box="north" style="height:330px;">
			   		<div class="panel panel-default full-width" >
						<div class="panel-body">
							<div class="row">
								<ul class="nav nav-tabs">
									<li ng-repeat="tab in tabs" ng-class="{'active':selectedTab==tab}">
										<a ng-bind="tab.label" ng-click="tabClick(tab)"></a>
									</li>
								</ul>
							</div>
							<div class="row" style="padding:4px 0px;">
								<div class="col-xs-6">
									<ul class="radio_button pull-left" ng-show="selectedTab.id != 'budget' " style="margin-bottom:0px;padding-left:0px;">
										<li ng-class="{'radio_button_active':typeSelected=='all'}" ng-click="typeClick('all')">总</li>
										<li ng-class="{'radio_button_active':typeSelected=='hosp'}" ng-click="typeClick('hosp')">住</li>
										<li ng-class="{'radio_button_active':typeSelected=='out'}" ng-click="typeClick('out')">门</li>
									</ul>
								</div>
								<div class="col-xs-6">
									<a class="btn btn-primary btn-sm pull-right" ng-show="selectedTab.id != 'percentage' " ng-click="queryFeeView()">查看趋势</a>
								</div>
							</div>
							<div class="row" style="height:254px;">
								<fwa-echarts type="bar.type" trigger="bar.trigger" text="bar.text" subtext="bar.subtext" 
								       grid="bar.grid"  legend-data="bar.legendData" 
								    legend-align ="bar.legendAlign" magic-type="bar.magicType" 
									axis-data="bar.axisData" axis-formatter="bar.axisFormatter"  
									color="bar.color" series="bar.series">
								</fwa-echarts>
							</div>
						</div>
					</div>
			   	</div>
			   	<div fwa-layout-box="center" class="background-white full-overflow-y">
				    <div class="full-width full-height ">
						<table class="fwa-table table table-bordered table-striped">
							<thead>
								<tr>
									<th ng-repeat="th in tableColumns" ng-class="{'text-right':$index!=0}">{{th.label}}</th>
								</tr>
							</thead>
							<tbody>
								<tr ng-repeat="data in tableDatas ">
									<td style="text-align: center;vertical-align: middle;" rowspan="{{data.rowSpan}}" ng-show="data.rowSpan">
										{{data.orgLevel}}
									</td>
									<td ng-show="selectedTab.id=='distribution'" class="text-right">
										<span ng-bind="kpiMap.{{data.kpiCode}}"></span>
									</td>
									<td class="text-right">
										{{data.all}}<span ng-show="selectedTab.id=='distribution' || selectedTab.id=='percentage'">%</span>
									</td>
									<td class="text-right">
										{{data.hosp}}<span ng-show="selectedTab.id=='distribution' || selectedTab.id=='percentage'">%</span>
									</td>
									<td class="text-right">
										{{data.out}}<span ng-show="selectedTab.id=='distribution' || selectedTab.id=='percentage'">%</span>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
			    </div>
		    </div>
	    </div>
    </div>
    <div fwa-layout-box="east" style="width:330px;" data-padding="true">
           <!-- 费用分布 -->
			<div class="panel panel-default full-width" style="height:50%;">
				<div class="panel-body full-height" >
					<div class="row full-height" >
						<fwa-echarts type="feeChart.type" series="feeChart.series" color="feeChart.color" 
							legend-data="feeChart.legendData" legend-align ="feeChart.legendAlign" 
							text="feeChart.text" grid="feeChart.grid" formatter="feeChart.formatter" 
							trigger="feeChart.type"></fwa-echarts>
					</div>
				</div>
			</div>
			
			<!-- 人次分布 -->
			<div class="panel panel-default full-width"  style="height:50%;" >
				<div class="panel-body full-height">
					<div class="row full-height" >
						<fwa-echarts type="visitorsChart.type" series="visitorsChart.series" color="visitorsChart.color" 
							legend-data="visitorsChart.legendData" legend-align ="visitorsChart.legendAlign" 
							text="visitorsChart.text" grid="visitorsChart.grid" formatter="visitorsChart.formatter" 
							trigger="visitorsChart.type"></fwa-echarts>
					</div>
				</div>
			</div>
	</div>
</div>

